<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>公司管理</title>
    <th:block th:include="statics/common/page/header"></th:block>
    <link rel="stylesheet" th:href="@{../statics/css/upload-template.css}"/>
    <style>
        .tab_btn_box{
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .tab_btn_box>.tab_btn{
            border: none;
            padding: 5px 10px;
            border-radius: 3px;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .tab_btn_box>.open{
            background: #2d8cf0;
            font-size: 0.5em;
            font-weight: 400;
            color: #fff;
        }
        .tab_btn_box>.close{
            background: #ed3f14;
            font-size: 0.5em;
            font-weight: 400;
            color: #fff;
        }
    </style>
</head>
<body>
<div id="companyBranch" v-cloak>
	<div v-show="showList">
        <Row class="search-panel-space">
            <div class="search-group">
                <i-col span="8">
                	<label class="search-label-20">门店名称:</label>
                    <i-input v-model="q.name" @on-enter="query" placeholder="门店名称" class="search-item-width-75"/>
                </i-col>
                <i-col span="8">
                	<label class="search-label-20">联系电话:</label>
                    <i-input v-model="q.phone" @on-enter="query" placeholder="联系电话" class="search-item-width-75"/>
                </i-col>
                <i-col span="7">
                	<label class="search-label-20">联系人:</label>
                    <i-input v-model="q.attn" @on-enter="query" placeholder="联系人" class="search-item-width-75"/>
                </i-col>
            </div>
        </Row>
        <Row type="flex" justify="end" class="code-row-bg">
            <i-col span="5">
                <i-button @click="query">查询</i-button>
                <i-button @click="reloadSearch">重置</i-button>
            </i-col>
        </Row>
        <Row :gutter="16">
            <div class="buttons-group">
                <i-button type="info" @click="add" th:if="${@shiroAuthService.hasPermission('org:companybranch:save')}">
                	<i class="fa fa-plus"></i>&nbsp;新增</i-button>
                <i-button type="warning" @click="update" th:if="${@shiroAuthService.hasPermission('org:companybranch:update')}">
                	<i class="fa fa-pencil-square-o"></i>&nbsp;修改</i-button>
                <i-button type="error" @click="del" th:if="${@shiroAuthService.hasPermission('org:companybranch:delete')}">
                	<i class="fa fa-trash-o"></i>&nbsp;删除</i-button>
            </div>
        </Row>
	    <table id="companyBranchGrid"></table>
    </div>

    <Card v-show="!showList">
        <p slot="title" style="height: 35px;">{{title}}
        	<i-button type="warning" @click="reload" style="margin-left: 8px"/>返回</i-button>
        </p>
		<i-form ref="formValidate" :model="orgCompanyBranch" :rules="ruleValidate" :label-width="120">
            <Row>
                <i-col  span="12">
                    <Form-item label="门店简称" prop="name" style="width: 450px;">
                        <i-input v-model="orgCompanyBranch.name" placeholder="门店简称"/>
                    </Form-item>
                </i-col>
                <i-col  span="12">
                    <Form-item label="所属公司" prop="companyId" style="width: 450px;" v-if="isAdmin">
                        <i-input type="text" v-model="orgCompanyBranch.companyName" icon="eye" readonly="readonly"
                                 @on-click="selectParentCompany" placeholder="所属公司" style="width: 320px;"/>
                    </Form-item>
                </i-col>
            </Row>
            <Row>
                <i-col  span="12">
                    <Form-item label="门店全称" prop="allName" style="width: 450px;">
                        <i-input v-model="orgCompanyBranch.allName" placeholder="门店全称"/>
                    </Form-item>
                </i-col>
                <i-col  span="12">
                    <Form-item label="门店编号" prop="serialNo" style="width: 450px;">
                        <i-input v-model="orgCompanyBranch.serialNo" placeholder="门店编号"/>
                    </Form-item>
                </i-col>
            </Row>

            <Row>
                <i-col  span="12">
                    <Form-item label="门店地址" prop="address" style="width: 600px;">
	                    <!-- <i-col span="8">
		            		<i-select v-model="orgCompanyBranch.provinceId" placeholder="请选择省份" @on-change="selectProvince">
			                    <i-option v-for="province in provinceList" :value="province.id" :key="province.id">{{province.name}}</i-option>
			                </i-select>
		            	</i-col>
		            	<i-col span="8">
			                <i-select v-model="orgCompanyBranch.cityId"  placeholder="请选择城市" @on-change="selectCity">
			                    <i-option v-for="city in cityList" :value="city.id" :key="city.id">{{city.name}}</i-option>
			                </i-select>
		            	</i-col>
		            	<i-col span="8">
			                <i-select v-model="orgCompanyBranch.areaId" ref="branchInfoArearesetSelect" placeholder="请选择县/区" @on-change="selectArea" clearable>
			                    <i-option v-for="area in areaList" :value="area.id" :key="area.id">{{area.name}}</i-option>
			                </i-select>
		            	</i-col> -->
                        <i-input v-model="orgCompanyBranch.address" placeholder="门店地址"/>
                    </Form-item>
                </i-col>
            </Row>

            <!-- <Row>
                <i-col  span="12">
                    <Form-item label="营业执照" prop="license" style="width: 450px;">
                        <div class="multiple-template-upload-list" v-for="item in uploadLicenseList">
                            <template v-if="item.status === 'finished' ">
                                <img :src="item.url">
                                <div class="multiple-template-upload-list-cover">
                                    <Icon type="ios-eye-outline" @click.native="handleView(item)"></Icon>
                                    <Icon type="ios-trash-outline" @click.native="handleRemove('license')"></Icon>
                                </div>
                            </template>
                            <template v-else>
                                <i-progress :percent="item.percentage" hide-info></i-progress>
                            </template>
                        </div>

                        <Upload ref="uploadLicenseref" :show-upload-list="false" :default-file-list="uploadLicenseList" :on-success="handleSuccessLicense"
                                :format="['jpg','jpeg','png']" :max-size="4096" :on-format-error="handleImgFormatError" :on-exceeded-size="handleImgMaxSize"
                                :before-upload="handleLicenseImgBeforeUpload" multiple action="http://upload.qiniu.com" :data="uploadInfo" style="display: inline-block;width:58px;">
                            <div class="multiple-template-upload-list" style="border: darkgrey 1px dashed;">
                                <Icon type="camera" size="20"></Icon>
                            </div>
                        </Upload>
                    </Form-item>
                </i-col>
            </Row> -->
            <Row>
                <i-col  span="12">
                    <Form-item label="联系人" prop="attn" style="width: 450px;">
                        <i-input v-model="orgCompanyBranch.attn" placeholder="联系人"/>
                    </Form-item>
                </i-col>
                <i-col  span="12">
                    <Form-item label="联系人电话" prop="phone" style="width: 450px;">
                        <i-input v-model="orgCompanyBranch.phone" placeholder="联系人电话"/>
                    </Form-item>
                </i-col>
            </Row>
            <Row>
                <i-col  span="12">
                    <Form-item label="门店电话" prop="tel" style="width: 450px;">
                        <i-input v-model="orgCompanyBranch.tel" placeholder="公司电话"/>
                    </Form-item>
                </i-col>
            </Row>
            <!-- <Row>
                <i-col  span="12">
                    <Form-item label="法人身份证正面" prop="idcardPositive" style="width: 450px;">
                        <div class="multiple-template-upload-list" v-for="item in uploadIdcardPositiveList">
                            <template v-if="item.status === 'finished' ">
                                <img :src="item.url">
                                <div class="multiple-template-upload-list-cover">
                                    <Icon type="ios-eye-outline" @click.native="handleView(item)"></Icon>
                                    <Icon type="ios-trash-outline" @click.native="handleRemove('idcardPositive')"></Icon>
                                </div>
                            </template>
                            <template v-else>
                                <img th:src="@{../statics/img/loading.gif}">
                                <i-progress :percent="item.percentage" hide-info></i-progress>
                            </template>
                        </div>

                        <Upload ref="uploadIdcardPositiveref" :show-upload-list="false" :default-file-list="uploadIdcardPositiveList" :on-success="handleSuccessIdcardPositive"
                                :format="['jpg','jpeg','png']" :max-size="4096" :on-format-error="handleImgFormatError" :on-exceeded-size="handleImgMaxSize"
                                :before-upload="handleIdcardPositiveImgBeforeUpload" multiple action="http://upload.qiniu.com" :data="uploadInfo" style="display: inline-block;width:58px;">
                            <div class="multiple-template-upload-list" style="border: darkgrey 1px dashed;">
                                <Icon type="camera" size="20"></Icon>
                            </div>
                        </Upload>
                    </Form-item>
                </i-col>
                <i-col  span="12">
                    <Form-item label="法人身份证反面" prop="idcardReverse" style="width: 450px;">
                        <div class="multiple-template-upload-list" v-for="item in uploadIdcardReverseList">
                            <template v-if="item.status === 'finished' ">
                                <img :src="item.url">
                                <div class="multiple-template-upload-list-cover">
                                    <Icon type="ios-eye-outline" @click.native="handleView(item)"></Icon>
                                    <Icon type="ios-trash-outline" @click.native="handleRemove('idcardReverse')"></Icon>
                                </div>
                            </template>
                            <template v-else>
                                <img th:src="@{../statics/img/loading.gif}">
                                <i-progress :percent="item.percentage" hide-info></i-progress>
                            </template>
                        </div>

                        <Upload ref="uploadIdcardReverseref" :show-upload-list="false" :default-file-list="uploadIdcardReverseList" :on-success="handleSuccessIdcardReverse"
                                :format="['jpg','jpeg','png']" :max-size="4096" :on-format-error="handleImgFormatError" :on-exceeded-size="handleImgMaxSize"
                                :before-upload="handleIdcardReverseImgBeforeUpload" multiple action="http://upload.qiniu.com" :data="uploadInfo" style="display: inline-block;width:58px;">
                            <div class="multiple-template-upload-list" style="border: darkgrey 1px dashed;">
                                <Icon type="camera" size="20"></Icon>
                            </div>
                        </Upload>
                    </Form-item>
                </i-col>
            </Row> -->

            <Row>
                <i-col  span="12">
                    <Form-item label="单位名称" prop="nameOfSeller" style="width: 450px;">
                        <i-input v-model="orgCompanyBranch.nameOfSeller" placeholder="销货单位名称"/>
                    </Form-item>
                </i-col>
                <i-col  span="12">
                    <Form-item label="纳税识别号" prop="taxIdentNumber" style="width: 450px;">
                        <i-input v-model="orgCompanyBranch.taxIdentNumber" placeholder="纳税识别号"/>
                    </Form-item>
                </i-col>
            </Row>
            <Row>
                <i-col  span="12">
                    <Form-item label="开户银行" prop="bankOfDeposit" style="width: 450px;">
                        <i-input v-model="orgCompanyBranch.bankOfDeposit" placeholder="开户银行"/>
                    </Form-item>
                </i-col>
                <i-col  span="12">
                    <Form-item label="银行账号" prop="bankOfDepositNumber" style="width: 450px;">
                        <i-input v-model="orgCompanyBranch.bankOfDepositNumber" placeholder="银行账号"/>
                    </Form-item>
                </i-col>
            </Row>
            <Row>
                <i-col  span="12">
                    <Form-item label="联系电话" prop="taxAuthorityName" style="width: 450px;">
                        <i-input v-model="orgCompanyBranch.taxAuthorityName" placeholder="联系电话"/>
                    </Form-item>
                </i-col>
                <i-col  span="12">
                    <Form-item label="公司地址" prop="taxAuthorityCode" style="width: 450px;">
                        <i-input v-model="orgCompanyBranch.taxAuthorityCode" placeholder="公司地址"/>
                    </Form-item>
                </i-col>
            </Row>

            <!-- <Form-item label="常用品牌" prop="brandList" style="width: 450px;">
            	<i-button type="primary" shape="circle" icon="ios-search" @click="selectBrandAll">选择车辆品牌</i-button>
           		<tag v-for="brandItem in orgCompanyBranch.brandList" type="dot" color="warning" :key="brandItem.id" :name="brandItem.id" closable @on-close="handleBrandRemove">{{brandItem.brand}}</tag>
            </Form-item> -->
            <Form-item>
                <i-button type="primary" @click="handleSubmit('formValidate')">提交</i-button>
                <i-button type="warning" @click="reload" style="margin-left: 8px"/>返回</i-button>
                <i-button type="ghost" @click="handleReset('formValidate')" style="margin-left: 8px">重置</i-button>
            </Form-item>
        </i-form>
	</Card>
</div>

<script th:src="@{../statics/js/org/companybranch.js}"></script>
</body>
</html>